<template>
    <view style="width: 700rpx;margin: 24rpx 16rpx 0rpx 16rpx;">
        <text style="font-size: 24rpx;color: rgba(255,55,71,1);">
            提示：若你的行业下方选择项没有，请先选择其他行业，后续上线后给予一次修改机会
        </text>
    </view>
    <view class="page-bottom">
        <category 
    :categoryList="categoryList" 
    :subCategoryList="subCategoryList" 
    @categoryMainClick="categoryMainClick" 
    @categorySubClick="categorySubClick"></category>
    </view>
    <view style="margin-top: 100rpx;">
        <view class="bottom">
            <button class="bottom-quxiao" @click="quxiao">取消</button>
            <button class="bottom-queren" @click="open">确认</button>
        </view>
    </view>
    <uni-popup ref="popup" type="dialog">
				<uni-popup-dialog :type="msgType" cancelText="取消" confirmText="确认" title="提示" content="选择的行业会自动关联到爆款视频打造,且选择后不予修改,请确认好行业" @confirm="queren"
					@close="quxiao1"></uni-popup-dialog>
	</uni-popup>
</template>

<script>
import category from '../../components/components/qiyue-category_2.0/components/qiyue-category/qiyue-category'
import { httpRequest } from '../../utils/http'
export default {
            components:{
                category
            },
            data() {
                return {
                    categoryList:[],
                    subCategoryList:[],
                    shopCate1Id:1,
                    shopCate2Id:0,
                    flag:false
                }
            },
            onLoad(options) {
                this.getShopCateAPI()
            },
            onUnload() {
                if(!this.flag){
                    uni.removeStorageSync('shoCate')
                }
            },
            methods: {
                open(){
                    this.$refs.popup.open('center')
                },
                quxiao(){
                    
                    uni.removeStorageSync('shoCate')
                    uni.navigateBack({ delta: 1 })
                },
                quxiao1(){
                    this.$refs.popup.close('center')
                },
                queren(){
                    this.flag = true
                    uni.navigateBack({ delta: 1 })
                },
                categoryMainClick(category){
                    console.log(category);
                    this.shopCate1Id = category.id1
                    this.subCategoryList = category.subCategoryList;
                },
                categorySubClick(category){
                    console.log(category);
                    this.shopCate2Id = category.id2
                    uni.setStorageSync('shoCate',{shopCate1Id:this.shopCate1Id,shopCate2Id:this.shopCate2Id,name:category.name})
                    // this.$refs.message.open()

                },
                async getShopCateAPI(){
                    uni.showLoading({
                        title: '加载中',
                        mask: false
                    })
            const res = await httpRequest('/api/addShop/shopCate12','POST')
            console.log(res.data);
            for(var i=0;i<res.data.length;i++){
                    var subList = [];
                    for(var j=0;j<res.data[i].shopCate2List.length;j++){
                        subList.push({"id2":res.data[i].shopCate2List[j].shopCate2Id,"name":res.data[i].shopCate2List[j].shopCate2Name,"logo":res.data[i].shopCate2List[j].imgPath})
                    }
                    this.categoryList.push({"id1":res.data[i].shopCate1Id,"name":res.data[i].shopCate1Name,"subCategoryList":subList})
                }
                this.subCategoryList = this.categoryList[0].subCategoryList;
                uni.hideLoading()
            // for(let i = 0;i<res.data.length;i++){
            //     this.shopCate[i].text = res.data[i].shopCate1Name
            //     this.shopCate[i].value = res.data[i].shopCate1Id
            //     this.shopCate[i].children = res.data[i].shopCate2List
            //     for(let j = 0;j<res.data[i].shopCate2List.length;j++){
            //         this.shopCate[i].children[j].text = res.data[i].shopCate2List[j].shopCate2Name
            //         this.shopCate[i].children[j].value = res.data[i].shopCate1Id+'-'+res.data[i].shopCate2List[j].shopCate2Id
            //     }
            // }
            
        }
            },
            dialogConfirm() {
				
			},
        }
</script>

<style scoped>
    .bottom{
        position: fixed;
        bottom: 0;
        height: 120rpx;
        left: 0;
        display: flex;
        justify-content: center;
        width: 100%;
        background-color: #fff;
        padding-top: 12rpx;
}
.page-bottom{
    overflow: hidden;
    background-color: #fff;
    width: 100%;
    height: 1331rpx;
    border-radius: 32rpx 32rpx 0 0;
    padding-top: 56rpx;
}
.bottom-quxiao{
    width: 330rpx;
    height: 86rpx;
    text-align: center;
    line-height: 88rpx;
    color: rgba(142,84,244,1);
    border: 1px solid rgba(142,84,244,1);
    margin: 0;
    background-color: #fff;
}
.bottom-queren{
    width: 332rpx;
    height: 88rpx;
    text-align: center;
    line-height: 88rpx;
    background-color: rgba(142,84,244,1);
    color: #fff;
    margin: 0;
    margin-left: 22rpx;
}
</style>